<Page
  [ngClass]="'home'"
  [title]="title"
  [subTitle]="'A UI library by WeChat official design team, includes the most useful widgets/modules in mobile web applications.'"
>
  <weui-accordion [activeFirst]="false" class="home-accordion" (select)="onSelecte($event)">
    <weui-accordion-panel class="weui-accordion-panel" *ngFor="let i of menuService.menus" [active]="i.show">
      <div class="weui-flex js_category" heading>
        <p class="weui-flex__item">{{ i.name }}</p>
        <img src="./assets/images/{{ i.icon }}.png" alt />
      </div>
      <div class="weui-cells">
        <ng-template ngFor let-si [ngForOf]="i.items">
          <a class="weui-cell weui-cell_access js_item" [routerLink]="['/example', si.id]" *ngIf="si.show !== false">
            <div class="weui-cell__bd">
              <p>{{ si.label }}</p>
            </div>
            <div class="weui-cell__ft"></div>
          </a>
        </ng-template>
      </div>
    </weui-accordion-panel>
  </weui-accordion>
</Page>
